{% extends "./inc/appbase.html" %}
{%block style%}
<style>
    .original {
        border: 1px solid #999;
        font-size: 10px !important;
        border-radius: 4px;
        line-height: 14px;
        width: 30px;
        color: #505050;
        text-align: center;
        margin-right: 5px;

        position: relative;
        padding: 0 2px;
    }
    .price {
        color: #e4393c;
    }
    .losspayer {
        color: #007fff;
    }
    .mui-table h4 ,.mui-media-body h4{
        font-size: 15px;
        margin: 0;
        font-weight: 300;
    }
    .mui-bar-nav ~ .mui-content .mui-pull-top-pocket{
        top: 0px !important;
    }
</style>
{%endblock%}

{% block content %}

<header class="mui-bar mui-bar-nav">
    <a  href="/center/index" class="mui-icon mui-icon-left-nav mui-pull-left"></a>
    <h1 class="mui-title">{{controller.meta_title}}</h1>
</header>
<div class="mui-content">
   <div class="mui-content-padded" >
        <h4 class="text-center">扫码或在游戏中填写我的邀请码!</h4>
        <h5 class="text-center">成为我的玩家</h5>
   </div>
   
   <div class="mui-content-padded text-center margin-top-40" >
        <img class="mui-media-object " id="qrcodeimg" src="{{qrcode}}" style="min-width:240px;height:240px">
   </div>
   
   <div class="mui-content-padded margin-top-40">
        <p class="text-center">
        <a class="mui-btn mui-btn-primary mui-btn-outlined text-center copyinvcode" id="{{userInfo.username}}">我的邀请码:{{userInfo.username}}</a>
        </p>
   </div>
   <input type="hidden" id="input" value="我的邀请码:{{userInfo.username}}"/>
</div>
{% endblock%}
{% block script %}

<script>
 	 
    //加载模板
    mui.init();
    
    mui.ready(function() {
        //链接
        mui("header").on('tap','.mui-pull-left',function(){
            var id = this.getAttribute("href");
            mui.openWindow({
                url: id,
            });
            return;
        })
        
       //复制邀请码
         
         mui(document).on('tap','a.copyinvcode',function(){
                var self = this;
                var message = this.getAttribute("id");
                var input = document.createElement("input");
                input.value = message;
                document.body.appendChild(input);
                input.select();
                input.setSelectionRange(0, input.value.length), document.execCommand('Copy');
                document.body.removeChild(input);
                mui.toast("复制邀请码  "+message+" 到剪贴板成功!");
                return false;
            })
         
         
    });

</script>
{% endblock %}